<template>
  <div style="border: 1px solid white;height: calc(100% - 2px)">
    <div class="app">
      <div class="top">
        <span class="fontStyle">
          <router-link to="/blog" class="commonLink">
            首页/
          </router-link>
        </span>
        <span class="fontStyle">我的</span>
      </div>

      <div class="body">
        <div class="userBox">
          <div class="headPic" :style="{backgroundImage: 'url('+user.headPicUrl+')'}">
            <div>{{user.uid}}</div>
            <div>{{user.username}}</div>
            <div>{{user.email}}</div>
            <div>{{user.level}}</div>
            <div>{{user.gender}}</div>
        </div>
       </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "Mine",
  data(){
    return {
      user:{}
    }
  },
  methods: {
    t(){

    }
  },
  created() {
    let admin = JSON.parse(window.localStorage.getItem("access-admin"))
    this.user = admin
    console.log(admin)
  }
}
</script>

<style scoped>
.headPic{
  width: 100px;
  height: 100px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
}
.userBox{
  width: 100%;
  height: 200px;
  border: 1px solid red;
}
.app{
  width: 900px;
  margin: 30px auto;
}
.top{
  padding: 5px;
  border-radius: 8px;
  border: 1px solid red;
}
.fontStyle{
  font-size: 14px;
  color: #5C657E;
}
.commonLink{
  text-decoration: none;
  color: #5C657E;
}
</style>
